<!--
 * @Description: 职位管理-新建岗位
 * @Author: xinqiao lxq1990.0716@qq.com
 * @Date: 2024-03-05
 * @LastEditors: xinqiao lxq1990.0716@qq.com
 * @LastEditTime: 2025-02-14
-->
<script lang="ts" setup>
  import { Form, message } from 'ant-design-vue'
  import { computed, reactive, watch } from 'vue'

  import { requestSavePosition } from '/@/api/business/company/position'
  import { HttpCodeEnum } from '/@/enums/httpEnum'
  import { getCompanyInfo, getPersonData } from '/@/storage'

  const { companyId } = getCompanyInfo()
  const { userName } = getPersonData()

  const props = defineProps({
    visible: { type: Boolean, default: false },
  })

  const emits = defineEmits(['update:visible', 'success'])

  const visible = computed({
    get: () => props.visible,
    set: (val: boolean) => emits('update:visible', val),
  })

  watch(
    () => visible.value,
    (newVal) => {
      if (newVal) onPageShow()
      else onPageHide()
    },
  )

  /**
   * 页面显示
   */
  const onPageShow = () => {}

  /**
   * 页面关闭
   */
  const onPageHide = () => resetFields()

  /** 表单配置 */
  const form = reactive({
    state: {
      title: '',
      content: '',
      publishTime: '',
    },
    rule: {
      title: [{ required: true, message: '请输入消息标题' }],
      content: [{ required: true, message: '请输入消息内容' }],
      publishTime: [{ required: true, message: '请选择发布时间' }],
    },
    onOk: async () => {
      console.log('form.state: ', form.state) //TODO
      await validate()
      // formatToDateTime(form.state.publishTime)
      const { responseCode } = await requestSavePosition({ companyId, positionName: form.state.name })
      if (responseCode === HttpCodeEnum.SUCCESS) {
        message.success('添加成功')
        visible.value = false
        emits('success')
      }
    },
  })
  /** 表单hook */
  const { validate, validateInfos, resetFields } = Form.useForm(form.state, form.rule)
</script>

<template>
  <div class="add">
    <a-modal v-model:visible="visible" title="新建系统公告" @ok="form.onOk">
      <a-form :label-col="{ span: 6 }" :wrapper-col="{ span: 16 }">
        <a-form-item label="消息标题" v-bind="validateInfos.title">
          <a-input v-model:value="form.state.title" placeholder="请输入" />
        </a-form-item>
        <a-form-item label="消息内容" v-bind="validateInfos.content">
          <a-textarea v-model:value="form.state.content" placeholder="请输入" />
        </a-form-item>
        <a-form-item label="发布时间" v-bind="validateInfos.publishTime">
          <a-date-picker v-model:value="form.state.publishTime" show-time placeholder="请选择" />
        </a-form-item>
        <a-form-item label="消息状态">
          <span class="color-error">待发送</span>
        </a-form-item>
        <a-form-item label="发布人">
          <span>{{ userName }}</span>
        </a-form-item>
      </a-form>
    </a-modal>
  </div>
</template>

<style lang="less" scoped></style>
